﻿/// <reference name="MicrosoftAjax.js"/>

Type.registerNamespace("ModulesToolkit.Web.UI");

ModulesToolkit.Web.UI.Popup = function (element)
{
    this._IsModel = true;
    this._CloseButtonId = null;
    this._repositionHandler = null;
    ModulesToolkit.Web.UI.Popup.dimmer =
                $("<div>").attr("id", "__popup__id")
                            .css("filter", "alpha(opacity=85)")
                            .css("opacity", "0.8")
                            .css("position", "fixed")
                            .css("top", 0)
                            .css("left", 0)
                            .css("z-index", 9000)
                            .css("background-color", "#eef3ee");
    ModulesToolkit.Web.UI.Popup.initializeBase(this, [element]);
}

ModulesToolkit.Web.UI.Popup.prototype = {
    initialize: function ()
    {
        ModulesToolkit.Web.UI.Popup.callBaseMethod(this, 'initialize');
        $(this.get_element()).show();

        // set position.
        this._reposition();
        this._repositionHandler = Function.createDelegate(this, this._reposition);
        $addHandler(window, 'resize', this._repositionHandler);
        $addHandler(window, 'scroll', this._repositionHandler);

        if (this.get_IsModel())
        {
            var bounds = this._getClientBounds();
            $(ModulesToolkit.Web.UI.Popup.dimmer).css("width", bounds.width).css("height", bounds.height);
            if ($("#__popup__id").length == 0)
                $(this.get_element()).parent().append(ModulesToolkit.Web.UI.Popup.dimmer);
        }
        if (this.get_IsDraggable())
        {
            this._makeDraggable();
        }
    },
    _reposition: function ()
    {
        var el = this.get_element();

        var scrollLeft = (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
        var scrollTop = (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);

        var clientBounds = this._getClientBounds();
        var clientWidth = clientBounds.width;
        var clientHeight = clientBounds.height;

        var xCoord = 0;
        var yCoord = 0;

        var foregroundelementwidth = el.offsetWidth ? el.offsetWidth : el.scrollWidth;
        xCoord = ((clientWidth - foregroundelementwidth) / 2);
        var foregroundelementheight = el.offsetHeight ? el.offsetHeight : el.scrollHeight;
        yCoord = ((clientHeight - foregroundelementheight) / 2);

        ($(el).css("position") == 'absolute')
        {
            xCoord += scrollLeft;
            yCoord += scrollTop;
        }
        $(el).css("left", xCoord + "px");
        $(el).css("top", yCoord + 'px');

        $(ModulesToolkit.Web.UI.Popup.dimmer).css("width", clientBounds.scrollWidth)
                                             .css("height", clientBounds.scrollHeight);
    },
    _getClientBounds: function ()
    {
        var clientWidth;
        var clientHeight;
        var scrollWidth;
        var scrollHeight;
        // getClientBounds must return dimensions excluding scrollbars, so cannot use window.innerWidth and window.innerHeight.
        if (document.compatMode == "CSS1Compat")
        {
            // Standards-compliant mode
            clientWidth = document.documentElement.clientWidth;
            clientHeight = document.documentElement.clientHeight;
            scrollHeight = document.documentElement.scrollHeight;
            scrollWidth = document.documentElement.scrollWidth;
        }
        else
        {
            // Quirks mode
            clientWidth = document.body.clientWidth;
            clientHeight = document.body.clientHeight;
            scrollHeight = document.body.scrollHeight;
            scrollWidth = document.body.scrollWidth;
        }
        return { width: clientWidth, height: clientHeight, scrollWidth: scrollWidth, scrollHeight: scrollHeight };
    },
    _makeDraggable: function ()
    {
        element = jQuery(this.get_element());

        // Move the element by the amount of change in the mouse position  
        var move = function (event)
        {
            if (element.data('mouseMove'))
            {
                var changeX = event.clientX - element.data('mouseX');
                var changeY = event.clientY - element.data('mouseY');

                var newX = parseInt(element.css('left')) + changeX;
                var newY = parseInt(element.css('top')) + changeY;

                element.css('left', newX);
                element.css('top', newY);

                element.data('mouseX', event.clientX);
                element.data('mouseY', event.clientY);
            }
        }

        element.mousedown(function (event)
        {
            element.css("cursor", "move");
            element.data('mouseMove', true);
            element.data('mouseX', event.clientX);
            element.data('mouseY', event.clientY);
        });

        element.parents(':last').mouseup(function ()
        {
            element.data('mouseMove', false);
            element.css("cursor", "");
        });

        element.mouseout(move);
        element.mousemove(move);
    },
    dispose: function ()
    {
        $removeHandler(window, "resize", this._repositionHandler);
        $removeHandler(window, "scroll", this._repositionHandler);
        //Add custom dispose actions here
        ModulesToolkit.Web.UI.Popup.callBaseMethod(this, 'dispose');
    },
    set_IsModel: function (value)
    {
        if (this._IsModel != value)
        {
            this._IsModel = value;
            this.raisePropertyChanged('IsModel');
        }
    },
    get_IsModel: function ()
    {
        return this._IsModel;
    },
    set_CloseButtonId: function (value)
    {
        if (this._CloseButtonId != value)
        {
            this._CloseButtonId = value;
            this.raisePropertyChanged('CloseButtonId');
        }
    },
    get_CloseButtonId: function ()
    {
        return this._CloseButtonId;
    },
    set_IsDraggable: function (value)
    { },
    get_IsDraggable: function ()
    {
        return this._IsDraggable
    }
}
ModulesToolkit.Web.UI.Popup.registerClass('ModulesToolkit.Web.UI.Popup', Sys.UI.Control);
if (typeof (Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();